{% extends 'base.html' %}
{% load staticfiles %}

{% block custom_css %} 
<style>
    .errorlist {
        color: red;
    }
</style>
{% endblock custom_css %}

{% block main %} 
<div class="ui modal" style="width: 650px;">
    <div class="header">
      用户注册
    </div>
    <div class="ui text container" style="margin: 20px; width: 80%;">
        <form method="post" action="{% url 'users:register' %}" id='register'>
            {% csrf_token %}
            <div class="ui form">
                {% for field in form %}
                    {{ field.label_tag }}     <!-- 控件的 label 标签 -->
                    {{ field }}               <!-- 表单控件 -->
                    {{ field.errors }}        <!-- 表单的错误（如果有的话）-->
                    {% if field.help_text %}  <!-- 控件相关的帮助信息 -->
                        <p>{{ field.help_text|safe }}</p>
                    {% endif %}
                {% endfor %}
            </div>
            <div class="ui center aligned container" style="padding: 10px;">
                <button class="ui fluid large teal submit button" id="devsubmit" type="submit">
                  注册
                </button>
                <input type="hidden" name="next" value="{{ next }}"/>
            </div>
        </form>

        <div class="ui center aligned container">
            <a href="{% url 'login' %}">已有账号登录</a>
        </div>
    </div>
</div>
{% endblock main %}

{% block custom_script %} 
<script type="text/javascript">
    $('.ui.modal')
        .modal({
          blurring: true
        })
        .modal('show')
    ;
</script>
{% endblock custom_script %}

